import React, { Component } from 'react';
import RegisterStyleComp from './RegisterStyleComp.js'
import {NavLink} from 'react-router-dom'
class Register extends Component {
    constructor(props) {
        super(props);
        this.state = { 

         };
    }

    LoginClick = () =>{
        const username = this.users.value;
        const password = this.password.value;        
        this.props.history.push('/login')
        localStorage.setItem('users',JSON.stringify({username,password}))   
        alert('注册成功')        
     }
    render() {
        return (
            <RegisterStyleComp>
             <div className='zhuce'>
                <header className='userTop'>
                        <NavLink to='mine' id='t-goback'>
                        <i className="fa fa-angle-left" aria-hidden="true"></i>
                        </NavLink>
                        <span className='geren'>用户注册</span>
                </header>
                 
                <form className="sui-form form-horizontal">
                    <div className="control-group">
                        <p className="reg-notice">注册卷皮账号</p>
                        <div>
                        <input 
                        type="text" id="inputEmail" placeholder="请输入用户名"
                        ref= {el=>this.users=el}
                        />
                        </div>
                    </div>
                    <div className="control-group">
                        <div>
                        <input 
                        type="password" id="inputPassword" placeholder="请输入密码"
                        ref= {el=>this.password=el} 
                        />
                        </div>
                    </div>
                    <div className="control-group">
                        <label className="control-label"></label>
                        <div className="controls">
                        <NavLink 
                        to='/login' className="sui-btn btn-primary"
                        onClick= {this.LoginClick}
                        >注册</NavLink>
                        </div>
                    </div>
                    </form>
              </div> 
            </RegisterStyleComp>
        );
    }
}

export default Register;